<template>
  <!--	<view style=" width: 100%;height: 2000rpx; margin: auto;margin-top: 30rpx;">-->

  <!--	</view>-->
  <view style="width: 95%;margin-left: 28rpx;" v-if="option.series.length>0">
    <view >訂單量折線圖</view>
    <l-echart v-if="option.series.length>0" ref="chart1" @finished="init"></l-echart>
  </view>

</template>

<script>
import * as echarts from '@/uni_modules/lime-echart/static/echarts.min'

export default {
  props: {
    dataSet: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      option: {
        title: {
          text: ""
        },
        legend: {
          type: 'scroll',
          show: true,
          x: 'right',
          y: 'top',
          // data: ['betate', '贝塔'],
        },
        tooltip: {
          trigger: "axis"
        },
        xAxis: {
          type: 'category',
          name: "时间",
        },
        yAxis: {
          name: '訂單量'
        },
        dataset: {
          dimensions: [],
          source: [],
        },
        series: [{
          type: 'line'
        }]
      }
    }
  },
  // watch: {
  // 	dataSet: {
  // 		deep: true, // 深度监听对象内部属性的变化
  // 		handler: function(newData) {
  // 			this.updateChart()
  // 			// this.$refs.chart.init(echarts, chart => {
  // 			// 	chart.setOption(this.option);
  // 			// });
  // 			this.init()
  // 		}
  // 	}
  // },
  methods: {
    async init() {
      this.updateChart()
      //转圈
      // chart 图表实例不能存在data里
      //转圈加载中

      const chart = await this.$refs.chart1.init(echarts);
      //关闭·
      chart.setOption(this.option)
    },
    updateChart() {
      this.option.dataset = this.dataSet
      let series = [];
      for (let item of this.dataSet.dimensions) {
        if (item != "time") {
          series.push({
            type: 'line'
          })
        }
      }
      this.option.series = series;
    }
  },
  mounted() {
  	this.updateChart()
  	this.$refs.chart1.init(echarts, chart => {
  		chart.setOption(this.option);
  	});
  }
}
</script>
